import React, {useContext} from 'react';
import {Form, Input, Select} from 'antd';
import WFC from '../context/OperatorContext';
import {roleList} from './role';
function getRoleList(value, roleList) {
  let list = [];
  for (let i = 0; i < roleList.length; i++) {
    if (value.includes(roleList[i].value)) {
      list.push(roleList[i]);
    }
  }
  return list;
}
const SetApprover = () => {
  const {currentNode, updateNode} = useContext(WFC);
  const values = currentNode.nodeUserList.map((i) => {
    return i.value;
  });
  const handleRoleChange = (value) => {
    currentNode['nodeUserList'] = getRoleList(value.value, roleList);

    updateNode();
  };
  const handleChange = ({key, value}) => {
    currentNode[key] = value;
    updateNode();
  };
  return (
    <>
      <Form.Item label='节点名称'>
        <Input placeholder='请输入节点名称' value={currentNode?.nodeName}  onChange={(e) => handleChange({key: 'nodeName', value: e.target.value})}/>
      </Form.Item>
      <Form.Item label='审核人'>
        <Select placeholder='请选择审核人'  mode='multiple' defaultValue={values} onChange={(value) => handleRoleChange({value})}  options={roleList}/>
      </Form.Item>
    </>
  );
};

export default SetApprover;
